import { View, ActivityIndicator, Text, Modal } from "react-native";
import { pxToDp } from "../utils/stylesKits";
import * as React from 'react';
import { MyContext } from '../store/index';
import { observer } from 'mobx-react-lite';
const Loading = (props = {text: '请求中'}) => {
    const context =  React.useContext(MyContext);
    const loadingInfo = context.globalLoading.getLoading();
    // console.error( loadingInfo, 'loadingInfo')
    return (
        <Modal transparent visible={loadingInfo.loading}>
            <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
                <View style={{ backgroundColor: 'rgba(0,0,0,0.5)', padding: pxToDp(30),paddingBottom: pxToDp(0), borderRadius: 5 }}>
                    <ActivityIndicator size="large" color="#fff" />
                    <View style={{ height: pxToDp(40),paddingTop: pxToDp(10) }}>
                    <Text style={{ color: '#fff',fontSize: pxToDp(12) }}>{loadingInfo.text}</Text>
                    </View>
                </View>
            </View>
        </Modal>
    );
};
export default observer(Loading);